<template>
	<view class="my-box">
		<view class="cell" @click="toLink('/pages/report/company/company')">
			<u-cell  title="疗休养单位申请" :isLink="true" :border="false">
				<template #icon>
					<i class="iconfont icons icon-danwei" ></i>
				</template>
			</u-cell>
		</view>
		
		<view class="cell" @click="toLink('/pages/report/work/work')">
			<u-cell  title="职工个人申报" :isLink="true" :border="false">
				<template #icon>
					<i class="iconfont icons icon-gerenzhongxin" ></i>
				</template>
			</u-cell>
		</view>
		
		<view class="liucheng-box">
			<view class="one">流程介绍</view>
			<view class="step-box">
				<view class="step-item">请各单位管理员完成单位疗休养账号申请，审核通过后您将会收到贵单位在柯桥区疗休养管理系统的账号、密码和邀请码。</view>
				<view class="step-item">单位账号申请成功后，请通知单位职工进入“老绍兴金柯桥”服务号完成个人申报。</view>
				<view class="step-item">职工完成申报后，请单位管理员登录“柯桥区疗休养管理系统(网址: https://ykq.yifangjia.com/company) 进行审核.</view>
			</view>
			<view class="tishi">
				<u-icon name="info-circle" color="#5BB87E" size="18" style="display: inline-block;"></u-icon> 
				<text class="text">提示: </text> <text>请将 <text class="red">单位邀请码</text> 告知各填报职工，作为职工个人申报单位识别凭证。</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			toLink(url){
				uni.navigateTo({
					url:url
				})
			},
		}
	}
</script>

<style lang="less">
page{
	background-color: #F4F4F4;
}
.icons{
	margin-right: 6rpx;
	font-size: 40rpx;
	color: #5BB87E;
}
.my-box{
	padding: 40rpx;
	.cell{
		margin-bottom: 30rpx;
		border-radius: 10rpx;
		overflow: hidden;
	}
	.liucheng-box{
		padding: 20rpx 30rpx;
		background-color: #FAFAFA;
		border-radius: 10rpx;
		.one{
			margin-bottom: 10rpx;
			color: #333333;
			font-size: 28rpx;
			font-weight: 600;
		}
		.step-box{
			padding-bottom: 20rpx;
			border-bottom: 1px solid #ccc;
		}
		.step-item{
		position: relative;
		margin-left: 20rpx;
		padding-bottom: 10rpx;
		padding-left: 32rpx;
		color: #666666;
		font-size: 28rpx;
		text-align: justify;
		word-wrap:break-word;
		word-break:break-all;
		counter-increment: order;/* 递增计数器（缺省增量为1） */
			&:last-of-type{
				border-left:0px;
			}
			&:before{
				content: counter(order);
				display: inline-block;
				position: absolute;
				top: 2px;
				left: -22rpx;
				width: 36rpx;
				margin-right: 10rpx;
				vertical-align: middle;
				text-align: center;
				color: #fff;
				font-weight: 700;
				line-height: 36rpx;
				border-radius: 50%;
				background-color: #5BB87E;
			}
		}
		.tishi{
			margin-top: 40rpx;
			color: #696969;
			.text{
				margin-left: 6rpx;
				color: #666666;
				font-weight: 600;
			}
			.red{
				color: #E0042F;
				font-weight: 600;
			}
		}
	}
}
.u-cell__body{
	background-color: #fff;
}
.u-icon{
	display: inline-block!important;
}
</style>
